<template>
  <el-form label-width="100px">
    <el-form-item label="SPU名称">SPU名称***</el-form-item>
    <el-form-item label="SKU名称">
      <el-input placeholder="SKU名称"></el-input>
    </el-form-item>
    <el-form-item label="价格(元)">
      <el-input></el-input>
    </el-form-item>
    <el-form-item label="重量(千克)">
      <el-input></el-input>
    </el-form-item>
    <el-form-item label="规格描述">
      <el-input type="textarea" :rows="4" placeholder="SKU名称"></el-input>
    </el-form-item>
    <el-form-item label="平台属性">
      <el-form-item label="手机系统">
        <el-row :gutter="10">
          <el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1">
            <el-select>
              <el-option>安卓手机</el-option>
              <el-option>苹果手机</el-option>
            </el-select>
          </el-col>
          <el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11">
            <div class="grid-content ep-bg-purple-light" />
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="电池容量">
        <el-row :gutter="10">
          <el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1">
            <el-select>
              <el-option>3000ma</el-option>
              <el-option>5000ma</el-option>
            </el-select>
          </el-col>
          <el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11">
            <div class="grid-content ep-bg-purple-light" />
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="电池容量">
        <el-row :gutter="10">
          <el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1">
            <el-select>
              <el-option>3000ma</el-option>
              <el-option>5000ma</el-option>
            </el-select>
          </el-col>
          <el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11">
            <div class="grid-content ep-bg-purple-light" />
          </el-col>
        </el-row>
      </el-form-item>
    </el-form-item>
    <el-form-item label="销售属性">
      <el-form-item label="手机颜色">
        <el-row :gutter="10">
          <el-col :xs="8" :sm="6" :md="4" :lg="3" :xl="1">
            <el-select>
              <el-option>安卓手机</el-option>
              <el-option>苹果手机</el-option>
            </el-select>
          </el-col>
          <el-col :xs="4" :sm="6" :md="8" :lg="9" :xl="11">
            <div class="grid-content ep-bg-purple-light" />
          </el-col>
        </el-row>
      </el-form-item>
    </el-form-item>
    <el-form-item label="图片列表">
      <el-table border @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="80"></el-table-column>
        <el-table-column label="图片"></el-table-column>
        <el-table-column label="名称"></el-table-column>
        <el-table-column label="操作"></el-table-column>
      </el-table>
      <el-button type="primary">保存</el-button>
      <el-button>取消</el-button>
    </el-form-item>
  </el-form>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
  name: 'SkuForm'
});
</script>
<script setup lang="ts">
import { ref } from 'vue'


</script>

<style scoped>
</style>